<template>

  <button @click="tryGet"> get按钮 </button>
    <div>{{ msg }}</div>
    <hr />

  <button @click="tryPost"> post按钮1-简单类型 </button>
    <div>{{ postTxt }}</div>
    <hr />

  <button @click="tryObj"> post按钮2-对象类型 </button>
  <div> 对象内容：id: {{ obj.id }}, 标题: {{ obj.title }}, 内容: {{ obj.content }} </div>
  <hr />

  <button @click="updateList"> 更新列表 </button>
    <div> 列表内容：
        <ul>
            <li v-for="item in myList"> {{ item }} </li>
        </ul>
    </div>
  <hr />


</template>

<script>

import {getGet, getPost, objPost, updateList} from "@/api/request";

export default {
    name: "LearnPage",
    data() {
        return {
            msg: "base",
            postTxt: "firstText",
            obj: {
                id: "1122",
                title: "题目",
                content: "内容在这"
            },
            myList: ["111", "222", "333"]
        }
    },
    methods: {
        async tryGet() {
            this.msg = await getGet(this.msg)
        },
        async tryPost() {
            this.postTxt = await getPost(this.postTxt)
        },
        async tryObj() {
            this.obj = await objPost(this.obj)
        },
        async updateList() {
            this.myList = await updateList(this.myList)
        }
    }

}
</script>

<style scoped>

</style>